{extend name='public/window' /}

{block name="content"}
<style>
    .layui-upload-drag {
        position: relative;
        padding: 10px;
        border: 1px dashed #e2e2e2;
        background-color: #fff;
        text-align: center;
        cursor: pointer;
        color: #999;
        border-radius: 50%;
    }
    .layui-input{
        width: 80%;
    }
    .layui-form-label{
        width: 100px;
    }
    .layui-layer{
        top: 90px;
    }
</style>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body" style="padding: 15px;">

            <form class="layui-form" action="" lay-filter="form">
                <div class="layui-form-item">
                    <label class="layui-form-label">相关图片 *</label>
                    <div style="display:flex;align-items: center;padding-top: 10px;flex-wrap: wrap">
                        {foreach ($info['list'] as $k=>$v)}
                            {if !empty($v['image'])}
                            <div style="margin-right: 10px">
                                <div style="text-align: center;width: 200px">{$v['textname']}</div>
                                <img src="{$v['image']}"  onclick="previewImg(this)" alt="" style="display: inline-block;width:300px;height: 200px">
                            </div>
                            {/if}
                        {/foreach}
                    </div>
                </div>
                {if isset($info.id)}
                <input type="hidden" name="id" value="{$info.id}">
                {/if}
                <input type="hidden" name="__token__" id="token" value="{:token()}"/>
                <div class="layui-form-item">
                    <label class="layui-form-label">商户 *</label>
                    <div class="layui-input-block">
                        <input type="text" disabled="disabled" value="{$info.merchant_name}" autocomplete="off"
                               placeholder="请输入姓名" class="layui-input disabled">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">电话 *</label>
                    <div class="layui-input-block">
                        <input type="text" disabled="disabled" lay-verify="required" value="{$info.merchant.mobile}" autocomplete="off"
                               placeholder="请输入手机号" class="layui-input disabled">
                    </div>
                </div>
                {if condition="$info['status'] eq 0"}
                <div class="layui-form">
                    <div class="layui-form-item">
                        <label class="layui-form-label">选择不合格图片</label>
                        <div class="layui-input-block">
                            <div id="select" style="width: 300px"></div>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">审核意见 </label>
                    <div class="layui-input-block">
                        <input placeholder="请输入"  class="layui-input" id="suggest" name="suggest">
                    </div>
                </div>
                <div class="layui-form-item layui-layout-admin " style="width: 100%">
                    <div class="layui-input-block">
                        <div class="layui-footer" style="left: 0px;text-align: center;">
                            <button class="layui-btn" lay-submit="" lay-filter="report">通过</button>
                            <button class="layui-btn layui-btn-danger" lay-submit="" lay-filter="noreport">不通过</button>
                        </div>
                    </div>
                </div>
                {else}
                {if !empty($info.noPassImg)}
                <div class="layui-form-item">
                    <label class="layui-form-label">审核不通过图片 *</label>
                    <div style="display:flex;align-items: center;padding-top: 10px;flex-wrap: wrap">
                        {foreach ($info['noPassImg'] as $k=>$v)}
                        <div style="margin-right: 10px">
                            <div style="text-align: center;width: 200px">{$v['textname']}</div>
                            <img src="{$v['image']}" onclick="previewImg(this)" alt="" style="display: inline-block;width:300px;height: 200px">
                        </div>
                        {/foreach}
                    </div>
                </div>
                {/if}

                <div class="layui-form-item">
                    <label class="layui-form-label">审核意见 </label>
                    <div class="layui-input-block">
                        <input type="text" lay-verify="required" disabled value="{$info.suggest}" autocomplete="off"
                               placeholder="" class="layui-input disabled">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">审核人 </label>
                    <div class="layui-input-block">
                        <input placeholder="请输入" disabled value="{$info.suggest_name}" class="layui-input" >
                    </div>
                </div>

                {/if}


            </form>
        </div>
    </div>
</div>


<script>
    layui.use(['element', 'form', 'jquery', 'lucky', 'upload', 'laydate', 'xmSelect'], function () {
        var element = layui.element;
        var table = layui.table;
        var form = layui.form;
        var laydate = layui.laydate;
        var $ = layui.jquery;
        var lucky = layui.lucky;
        var xmSelect = layui.xmSelect;
        var info = {:json_encode($info)};
        var demo = xmSelect.render({
            el:'#select',
            data:info['imageList']
        })
        form.on('submit(report)', function (data) {
            lucky.FormSubmit("{:url('report')}", data.field, true);
            return false;
        });
        form.on('submit(noreport)', function (data) {
            lucky.FormSubmit("{:url('noreport')}", data.field, true);
            return false;
        });
    })

    function previewImg(url){
        console.log(url.src);
        var imgHtml = "<img src='" + url.src + "' width='100%' height='100%'/>";
        //弹出层
        layer.open({
            type: 1,
            shade: 0.8,
            offset: ['top:10px'],
            area: [600 + 'px', 700 + 'px'],
            shadeClose: true,
            scrollbar: false,
            title: "图片预览",
            content: imgHtml,
            cancel: function () {

            }
        });
    }
</script>

{/block}
